<template>
  <el-collapse v-model="activeName" accordion>
    <el-collapse-item name="1">
      <template slot="title">
        <i class="el-icon-search" />搜索栏
      </template>
      <el-form class="searchform" :model="parent.params" :inline="true" size="mini" label-width="auto">
        <!--<el-form-item label="条码">
            <el-input v-model="params.upcNbr" placeholder="输入条码搜索" clearable style="width: 200px;" />
        </el-form-item>-->
        <el-form-item v-if="parent.changeType === 5" label="流水号">
          <el-input v-model="parent.params.vendorPortalId" size="mini" placeholder="输入流水号" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="商品号">
          <el-input v-model="parent.params.itemNbr" size="mini" placeholder="输入商品号搜索" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="部门">
          <el-input v-model="parent.params.deptNbr" size="mini" placeholder="输入部门搜索" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="商品说明1">
          <el-input v-model="parent.params.item1Desc" size="mini" placeholder="输入商品说明1模糊匹配" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="供应商之商品代码">
          <el-input v-model="parent.params.vendorStockId" size="mini" placeholder="输入供应商之商品代码" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="供应商编号">
          <el-input v-model="parent.params.vendorNbr" size="mini" placeholder="输入供应商编号" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="供应商名称">
          <el-input v-model="parent.params.vendorName" size="mini" placeholder="输入供应商名称模糊匹配" clearable style="width: 200px;" />
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="parent.params.itemStatus" size="mini" placeholder="选择搜索" clearable style="width: 200px">
            <el-option v-for="itemStatus in parent.itemStatuses" :key="itemStatus.value" :label="itemStatus.name" :value="itemStatus.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="上传时间">
          <el-date-picker
            v-model="syncTime"
            size="mini"
            type="datetimerange"
            value-format="yyyy/MM/dd HH:mm:ss"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            @change="syncTimeChange"
          />
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" style="float:right;margin-left:0px;" icon="el-icon-refresh" round @click="resetForm">重置</el-button>
          <el-button size="mini" type="primary" style="float:right;margin-left:0px;" icon="el-icon-search" round @click="toQuery">查询</el-button>
        </el-form-item>
      </el-form>
    </el-collapse-item>
  </el-collapse>
</template>
<script>
export default {
  props: {
    parent: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      syncTime: [],
      activeName: '1'
    }
  },
  methods: {
    toQuery() {
      this.parent.toQuery()
    },
    // 上传时间日期组件触发
    syncTimeChange(val) {
      this.parent.params.findSyncTimeStartDate = val[0]
      this.parent.params.findSyncTimeEndDate = val[1]
    },
    // 查询栏重置触发
    resetForm() {
      this.parent.params = {}
      this.syncTime = []
    }
  }
}
</script>
